<template>
	<view class="tabbar">
		<u-tabbar :value="tabIndex" :border="false" @change="changeTabbar()" v-if="userType == 'operator'" activeColor="#17CC77">
			<u-tabbar-item v-for="(v,i) in userList" :key="i" :text="v.text">
				<image class="img" slot="active-icon" :src="v.activeIcon"></image>
				<image class="img" slot="inactive-icon" :src="v.icon"></image>
			</u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				list: [],
				userList: [{
						text: '工作台',
						icon: require('../../static/home.png'),
						activeIcon: require('../../static/home-active.png'),
						path: '/pages/operator/operator'
					},
					{
						text: '设置',
						icon: require('../../static/setting.png'),
						activeIcon: require('../../static/setting.png'),
						path: '/pages/operator/setting'
					}
				]
			}
		},
		computed: {
			...mapState(['userType', 'tabIndex']),
		},
		methods: {
			...mapMutations(['setTabIndex']),
			changeTabbar(i) {
				this.setTabIndex(i)
				if (this.userType == 'operator') {
					this.$emit('switch',this.tabIndex)
					// uni.redirectTo({
					// 	url: this.userList[i].path
					// })
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tabbar {
		.img {
			width: 46rpx;
			height: 46rpx;
		}
	}
</style>